<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!-- 引入ElementUI样式 -->
    <link rel="stylesheet" href="../js/index.css">
    <!-- 引入ElementUI组件库 -->
    <script src="../js/vue.js"></script>
    <script src="../js/index.js"></script>

</head>
<body>
<div id="app">
    <button @click="clickme">点击我</button>
    {{username}}
</div>
<style>
    .el-header, .el-footer {
        background-color: #B3C0D1;
        color: #333;
        text-align: left;
        line-height: 60px;
    }

    .el-aside {
        background-color: #D3DCE6;
        color: #333;
        text-align: center;
        line-height: 200px;
    }

    .el-main {
        background-color: #E9EEF3;
        color: #333;
        text-align: center;
        line-height: 590px;
    }
</style>
<script>
    new Vue({
        el:'#app',
        data:{
            username : '张三',
            age :18,
            data : 'aaa'
        },
        methods:{
            clickme (){
                console.log(this.age)
            }
        },
        created(){
            //发起请求，获取后端数据
            alert('123')
        }
    });
</script>
</body>
</html>